﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title>树控件</title>     
    <meta name="keywords" content="免费控件,免费UI控件,免费开源UI,免费开源UI控件,免费开源UI框架,树,tree,动态树,大数据树" /> 
    <script src="../../lib/jquery/jquery-1.9.0.min.js" type="text/javascript"></script>
    <link href="../../lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
    <script src="../../lib/ligerUI/js/core/base.js" type="text/javascript"></script>
    <script src="../../lib/ligerUI/js/plugins/ligerTree.js" type="text/javascript"></script>
    <script type="text/javascript">
        var data = [];
             
        data.push({ id: 1, pid: 0, text: '1' });
        data.push({ id: 2, pid: 1, text: '1.1' });
        data.push({ id: 4, pid: 2, text: '1.1.2' });
        data.push({ id: 5, pid: 2, text: '1.1.2' });      

        data.push({ id: 10, pid: 8, text: 'wefwfwfe' });
        data.push({ id: 11, pid: 8, text: 'wgegwgwg' });
        data.push({ id: 12, pid: 8, text: 'gwegwg' });

        data.push({ id: 6, pid: 2, text: '1.1.3', ischecked: true });
        data.push({ id: 7, pid: 2, text: '1.1.4' });
        data.push({ id: 8, pid: 7, text: '1.1.5' });
        data.push({ id: 9, pid: 7, text: '1.1.6' });
         
        $(function ()
        {
           $("#tree1").ligerTree({
                data: data,
                idFieldName: 'id',
                slide: false,
                enabledCompleteCheckbox:false, 
                parentIDFieldName: 'pid'
            });
  
           $("#tree2").ligerTree({
               data: data,
               idFieldName: 'id',
               slide: false,
               enabledCompleteCheckbox: true,
               parentIDFieldName: 'pid'
           });

           $("#tree3").ligerTree({
               data: data,
               idFieldName: 'id',
               slide: false,
               autoCheckboxEven: false,
               parentIDFieldName: 'pid'
           });
        });
    </script>
</head>
<body style="padding:10px">   
 
        <div style="margin: 10px; border: 1px solid rgb(204, 204, 204); border-image: none; width: 300px; height: 300px; overflow: auto; float: left;">
    <ul id="tree1"></ul>
    </div>  
  <div style="margin: 10px; border: 1px solid rgb(204, 204, 204); border-image: none; width: 300px; height: 300px; overflow: auto; float: left;">
    <ul id="tree2"></ul>
    </div>

         <div style="margin: 10px; border: 1px solid rgb(204, 204, 204); border-image: none; width: 300px; height: 300px; overflow: auto; float: left;">
    <ul id="tree3"></ul>
    </div>


        <div style="display:none">
     
    </div>
</body>
</html>
